<template>
  <BasicDrawer
    v-bind="$attrs"
    :isDetail="true"
    :showDetailBack="false"
    :destroyOnClose="true"
    @register="registerDrawer"
    width="70%"
    title="详情"
  >
    <Description @register="registerDescripton" />
  </BasicDrawer>
</template>

<script setup lang="ts">
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import { useDescription } from '/@/components/Description';
  import { Description } from '/@/components/Description/index';
  import { detailSchema } from './AlarmDrawer.data';

  const [registerDescripton, { setDescProps }] = useDescription();
  const [registerDrawer, { setDrawerProps }] = useDrawerInner(async ({ record }) => {
    setDrawerProps({
      headerStyle: {
        'padding-left': '12px',
      },
    });
    setDescProps({
      schema: detailSchema,
      data: {
        ...record,
      },
      size: 'middle',
      column: 2,
      bordered: false,
      labelStyle: {
        fontSize: '17px',
        marginTop: '20px',
      },
      contentStyle: {
        fontSize: '17px',
        marginTop: '20px',
      },
    });
  });
</script>
